<template>
  <div class="add-wrap" v-loading="loading">
    <Breadcrumb :titles="titles"></Breadcrumb>
    <div class="body">
      <div class="project">
        <el-form
          :model="basicForm"
          label-position="top"
          :rules="basicRules"
          ref="basicFormRef"
        >
          <!-- 产出数据信息 -->
          <div class="project-part">
            <div class="project-part-title">企业信息</div>

            <el-row>
              <!-- <el-col :span="6">
                <el-form-item label="年月">
                  <el-cascader
                    v-model="basicForm.date"
                    :options="options"
                    :disabled="!isEdit"
                  >
                  </el-cascader>
                </el-form-item>
              </el-col> -->

              <el-col :span="6">
                <el-form-item label="企业名称" prop="name">
                  <el-input
                    v-model="basicForm.name"
                    placeholder="请输入"
                    :disabled="isDetail"
                  ></el-input>
                </el-form-item>
              </el-col>

              <el-col :span="6">
                <el-form-item
                  label="统一社会信用代码"
                  prop="socialCode"
                >
                  <el-input
                    v-model="basicForm.socialCode"
                    placeholder="请输入"
                    :disabled="isDetail"
                  ></el-input>
                </el-form-item>
              </el-col>

              <el-col :span="6">
                <el-form-item label="注册资本">
                  <el-input
                    v-model="basicForm.registerMoney"
                    placeholder="请输入"
                    :disabled="isDetail"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="注册/核准时间">
                  <el-date-picker
                    v-model="basicForm.registerTime"
                    type="date"
                    :disabled="isDetail"
                    placeholder="选择日期"
                  >
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="6">
                <el-form-item label="注册地址">
                  <el-input
                    v-model="basicForm.registerAddress"
                    placeholder="请输入"
                    :disabled="isDetail"
                  ></el-input>
                </el-form-item>
              </el-col>

              <el-col :span="6">
                <el-form-item label="企业分类">
                  <el-select
                    v-model="basicForm.type"
                    :disabled="isDetail"
                    placeholder="请选择"
                  >
                    <el-option
                      v-for="item in enterpriseTypeOptions"
                      :key="item"
                      :label="item"
                      :value="item"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>

              <el-col :span="6">
                <el-form-item label="企业类型">
                  <el-select
                    v-model="basicForm.projectTopLevel"
                    :disabled="isDetail"
                    :multiple="true"
                    placeholder="请选择"
                  >
                    <el-option
                      v-for="item in projectLevelOptions"
                      :key="item"
                      :label="item"
                      :value="item"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>

              <el-col :span="6">
                <el-form-item label="所属产业链">
                  <el-select
                    v-model="basicForm.industryLink"
                    :disabled="isDetail"
                    :filterable="true"
                    placeholder="请选择"
                  >
                    <el-option
                      v-for="item in industrialChainOptions"
                      :key="item"
                      :label="item"
                      :value="item"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>

              <!-- <el-col :span="6">
                <el-form-item label="引进/培育">
                  <el-select
                    v-model="basicForm.breed"
                    :disabled="isDetail"
                    placeholder="请选择"
                  >
                    <el-option
                      v-for="item in importAndRaiseOptions"
                      :key="item"
                      :label="item"
                      :value="item"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>

              <el-col :span="6">
                <el-form-item label="大型企业">
                  <el-select
                    v-model="basicForm.bigFlag"
                    :disabled="isDetail"
                    placeholder="请选择"
                  >
                    <el-option
                      v-for="item in isLargeEnterpriseOptions"
                      :key="item"
                      :label="item"
                      :value="item"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col> -->
            </el-row>

            <el-row>
              <el-col :span="6">
                <el-form-item label="估值">
                  <el-input
                    v-model="basicForm.valuation"
                    placeholder="请输入"
                    :disabled="isDetail"
                  ></el-input>
                </el-form-item>
              </el-col>

              <el-col :span="6">
                <el-form-item label="企业介绍">
                  <el-input
                    v-model="basicForm.messageContent"
                    placeholder="请输入"
                    :disabled="isDetail"
                    type="textarea"
                    :rows="3"
                  ></el-input>
                </el-form-item>
              </el-col>

              <el-col :span="6">
                <el-form-item label="企业联系人">
                  <el-input
                    v-model="basicForm.leader"
                    placeholder="请输入"
                    :disabled="isDetail"
                  ></el-input>
                </el-form-item>
              </el-col>

              <el-col :span="6">
                <el-form-item label="联系方式" prop="phone">
                  <el-input
                    v-model="basicForm.contract"
                    placeholder="请输入"
                    :disabled="isDetail"
                  ></el-input>
                </el-form-item>
              </el-col>

              <el-col :span="6">
                <el-form-item
                  label="服务专员"
                  prop="serviceAgent"
                >
                  <el-input
                    v-model="basicForm.serviceAgent"
                    placeholder="请输入"
                    :disabled="isDetail"
                  ></el-input>
                </el-form-item>
              </el-col>

              <el-col :span="6">
                <el-form-item label="入驻载体">
                  <el-cascader
                    v-model="basicForm.buildId"
                    @change="handleChangeBuildId"
                    :options="buildListOptions"
                    :disabled="isDetail"
                    clearable
                    :placeholder="'请选择'"
                    :filterable="true"
                    :props="{
                      label: 'name',
                      value: 'pkid',
                      children: 'buildInfoList',
                      emitPath: false,
                      checkStrictly: false
                    }"
                  />
                </el-form-item>
              </el-col>
              <!-- </el-row>

            <el-row> -->
              <el-col :span="6">
                <el-form-item label="入驻面积(平方米)">
                  <el-input
                    v-model="basicForm.occupancyArea"
                    placeholder="请输入"
                    :disabled="isDetail"
                  ></el-input>
                </el-form-item>
              </el-col>

              <el-col :span="6">
                <el-form-item label="入驻楼层">
                  <el-input
                    v-model="basicForm.occupancyNum"
                    placeholder="请输入"
                    :disabled="isDetail"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="入驻时间">
                  <el-date-picker
                    v-model="basicForm.occupancyTime"
                    type="date"
                    :disabled="isDetail"
                    placeholder="选择日期"
                  />
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="数据来源">
                  <el-input
                    v-model="basicForm.dataSource"
                    placeholder="请输入"
                    :disabled="true"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="数据来源部门">
                  <el-input
                    v-model="basicForm.department"
                    placeholder="请输入"
                    :disabled="true"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </div>
        </el-form>
      </div>
    </div>
    <div class="line" v-show="!isDetail">
      <el-button @click="saveInfo" class="save-btn"
        >保存</el-button
      >
    </div>
  </div>
</template>

<script>
import Breadcrumb from '@/components/breadcrumb'
import {
  isScaleEnterpriseOptions,
  isFixedInvestmentOptions,
  enterpriseTypeOptions,
  importAndRaiseOptions,
  isLargeEnterpriseOptions,
  industrialChainOptions,
  projectLevelOptions
} from '@/utils/project/data'
import {
  addEnterpriseInfo,
  enterpriseInfoBuildQuery,
  querySettledCarrier
} from '@/api/dataManagement'
import dayjs from 'dayjs'

export default {
  props: {
    pkid: String,
    title: String,
    data: Object,
    isEdit: {
      type: Boolean,
      default: false
    },
    isDetail: {
      type: Boolean,
      default: false
    }
  },
  components: {
    Breadcrumb
  },
  data() {
    return {
      basicForm: {
        pkid: '',
        name: '',
        socialCode: '',
        registerMoney: '',
        registerTime: '',
        registerAddress: '',
        type: '',
        breed: '',
        bigFlag: '',
        messageContent: '',
        occupancyArea: '',
        buildId: '',
        projectTopLevel: [], // 企业类型
        industryLink: '', // 所属产业链
        valuation: '', // 估值
        serviceAgent: '', // 服务专员
        occupancyNum: '', // 入驻楼层
        occupancyTime: '', // 入驻时间
        dataSource: '', // 数据来源
        department: '' // 数据来源所属部门
      },
      basicRules: {
        name: [
          {
            required: true,
            message: '请输入企业名称',
            trigger: 'blur'
          }
        ],
        socialCode: [
          {
            required: true,
            message: '请输入统一社会信用代码',
            trigger: 'blur'
          }
        ]
      },
      loading: false,
      props: { multiple: true },
      options: [],
      buildListOptions: []
    }
  },
  computed: {
    titles() {
      return [this.title]
    },
    isScaleEnterpriseOptions() {
      return isScaleEnterpriseOptions
    },
    isFixedInvestmentOptions() {
      return isFixedInvestmentOptions
    },
    enterpriseTypeOptions() {
      return enterpriseTypeOptions
    },
    importAndRaiseOptions() {
      return importAndRaiseOptions
    },
    isLargeEnterpriseOptions() {
      return isLargeEnterpriseOptions
    },
    industrialChainOptions() {
      return industrialChainOptions
    },
    projectLevelOptions() {
      return projectLevelOptions
    }
  },
  watch: {},
  mounted() {
    // this.initMonth()
    this.getSettledCarrierOptions()
    this.initData()
    // this.getBuildList()
  },
  methods: {
    handleChangeBuildId(value) {
      console.log('value : ', value)
      if (
        !this.basicForm.occupancyTime &&
        !this.isEdit &&
        !this.isDetail
      ) {
        this.basicForm.occupancyTime =
          dayjs().format('YYYY-MM-DD')
      }
    },
    getSettledCarrierOptions() {
      const params = {
        pageIndex: 1,
        pageSize: 999
      }
      querySettledCarrier(params).then((res) => {
        if (res.success) {
          this.buildListOptions = this.processBuildList(
            res.data
          )
        }
      })
    },
    processBuildList(buildList) {
      // 遍历每个项目
      return buildList.map((item) => {
        const currentItem = {
          pkid: item.pkid.toString(),
          name: item.name
        }

        if (
          item.buildInfoList &&
          item.buildInfoList.length > 0
        ) {
          currentItem.buildInfoList = this.processBuildList(
            item.buildInfoList
          ) // 递归处理子项
        }

        return currentItem
      })
    },

    initData() {
      if (this.pkid) {
        this.basicForm = JSON.parse(
          JSON.stringify(this.data)
        )
        // if (this.basicForm.buildId) {
        //   // 将保存的路径字符串转换回数组格式
        //   this.basicForm.buildId =
        //     this.basicForm.buildId.split(',')
        // } else {
        //   this.basicForm.settledCarrier = []
        // }
        this.basicForm.projectTopLevel = this.basicForm
          .projectTopLevel
          ? this.basicForm.projectTopLevel.split(',')
          : []
      } else {
        // 新增时默认数据
        if (!this.isDetail && !this.isEdit) {
          this.basicForm.dataSource = '企业信息管理'
          this.basicForm.department =
            localStorage.getItem('deptName')
        }
      }
    },
    // getBuildList() {
    //   const params = {
    //     pageIndex: 1,
    //     pageSize: 999
    //   }
    //   enterpriseInfoBuildQuery(params).then((res) => {
    //     if (res.success) {
    //       this.buildListOptions = res.data.list
    //     }
    //   })
    // },
    initMonth() {
      const date = new Date()

      if (!this.isEdit) {
        const month = dayjs(date)
          .subtract(1, 'month')
          .format('YYYY-M')
        this.basicForm.date = [
          month.split('-')[0],
          month.split('-')[1]
        ]
      }

      let monthList = []
      for (let i = 0; i < 12; i++) {
        monthList.push({
          label: (i + 1).toString(),
          value: (i + 1).toString()
        })
      }
      const year = date.getFullYear()
      this.options = [
        {
          value: year.toString(),
          label: year.toString(),
          children: monthList
        },
        {
          value: (year - 1).toString(),
          label: (year - 1).toString(),
          children: monthList
        }
      ]

      if (this.pkid) {
        this.basicForm = JSON.parse(
          JSON.stringify(this.data)
        )
        this.basicForm.date = [
          `${this.data.year}`,
          `${this.data.month}`
        ]
      }
    },
    // 保存信息
    saveInfo() {
      this.$refs.basicFormRef.validate((res) => {
        if (res) {
          // if (this.basicForm.date) {
          //   this.basicForm.year = this.basicForm.date[0]
          //   this.basicForm.month = this.basicForm.date[1]
          // }
          this.basicForm.buildId
            ? this.basicForm.buildId
            : (this.basicForm.buildId = '')
          if (this.basicForm.registerTime) {
            this.basicForm.registerTime = dayjs(
              this.basicForm.registerTime
            ).format('YYYY-MM-DD')
          } else {
            this.basicForm.registerTime = ''
          }

          // if (this.basicForm.buildId) {
          //   this.basicForm.buildId =
          //     this.basicForm.buildId.join(',')
          // } else {
          //   this.basicForm.buildId = ''
          // }

          addEnterpriseInfo({
            ...this.basicForm,
            projectTopLevel: this.basicForm.projectTopLevel
              ?.length
              ? this.basicForm.projectTopLevel.join(',')
              : ''
          }).then((res) => {
            if (res.success) {
              this.$message.success('编辑成功')
              this.$router.push({
                path: '/dataManagement/enterpriseManagement/enterpriseInfo/list',
                query: { refresh: Date.now() }
              })
            } else {
              this.$message.error(res.message)
            }
          })
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
@import '~@/assets/css/form.scss';
.add-wrap {
  .body {
    padding: 10px 0 0 20px;

    // &-left {
    //   width: 70%;
    //   border-right: 1px solid #f1f1f1;
    //   overflow: scroll;
    // }

    // &-right {
    //   flex: 1;
    //   padding-left: 10px;
    // }

    .top {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      padding-right: 10px;
    }
  }

  .line {
    display: flex;
    justify-content: center;
  }
}
</style>
